<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta charset="utf-8" />
		<title th:text="#{admin.calendar.title} + ' - ' + #{website.name}"></title>

		<meta name="description" content="with draggable and editable events" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

	  	<!-- ico -->
	  	<link th:href="@{/static/web/img/logos/logo.ico}" rel="shortcut icon" type="image/x-icon">
	  	
		<!-- bootstrap & fontawesome -->
		<link rel="stylesheet" th:href="@{/static/admin/css/bootstrap/bootstrap.min.css}" />
		<link rel="stylesheet" th:href="@{/static/admin/font-awesome/4.5.0/css/font-awesome.min.css}" />

		<!-- page specific plugin styles -->
		<link rel="stylesheet" th:href="@{/static/admin/css/jquery-ui/jquery-ui.min.css}" />
		<link rel="stylesheet" th:href="@{/static/admin/css/fullcalendar/fullcalendar.min.css}" />

		<!-- text fonts -->
		<link rel="stylesheet" th:href="@{/static/admin/css/fonts.googleapis.com.css}" />

		<!-- ace styles -->
		<link rel="stylesheet" th:href="@{/static/admin/css/ace/ace.min.css}" class="ace-main-stylesheet" id="main-ace-style" />

		<!--[if lte IE 9]>
			<link rel="stylesheet" th:href="@{/static/admin/css/ace/ace-part2.min.css}" class="ace-main-stylesheet" />
		<![endif]-->
		<link rel="stylesheet" th:href="@{/static/admin/css/ace/ace-skins.min.css}" />
		<link rel="stylesheet" th:href="@{/static/admin/css/ace/ace-rtl.min.css}" />

		<!--[if lte IE 9]>
		  <link rel="stylesheet" th:href="@{/static/admin/css/ace/ace-ie.min.css}" />
		<![endif]-->

		<!-- inline styles related to this page -->

		<!-- ace settings handler -->
		<script th:src="@{/static/admin/js/ace/ace-extra.min.js}"></script>

		<!-- HTML5shiv and Respond.js for IE8 to support HTML5 elements and media queries -->

		<!--[if lte IE 8]>
		<script th:src="@{/static/admin/js/plugins/html5shiv.min.js}"></script>
		<script th:src="@{/static/admin/js/plugins/respond.min.js}"></script>
		<![endif]-->
	</head>

	<body class="no-skin">
	
	  <!-- 公共页面的头部 -->
	  <div th:insert="admin/common/header :: header"></div>
	
		<div class="main-container ace-save-state" id="main-container">
			<script type="text/javascript">
				try{ace.settings.loadState('main-container')}catch(e){}
			</script>
			
			<!-- 公共页面的侧边栏 -->
			<div th:replace="admin/common/sidebar :: sidebar"></div>

			<div class="main-content">
				<div class="main-content-inner">
					<div class="breadcrumbs ace-save-state" id="breadcrumbs">
						<ul class="breadcrumb">
							<li>
								<i class="ace-icon fa fa-home home-icon"></i>
								<a href="./index" th:text="#{admin.index.index}">主页</a>
							</li>
							<li>实用工具</li>
							<li>日历记事本</li>
						</ul><!-- /.breadcrumb -->

						<!-- 公共页面的搜索框 -->
						<div th:replace="admin/common/search :: search"></div>
					</div>

					<div class="page-content">
						
						<!-- 引入公共的settings-container -->
						<div th:replace="admin/common/settingsContainer :: settings-container"></div>

						<div class="row">
							<div class="col-xs-12">
								<!-- PAGE CONTENT BEGINS -->
								<div class="row">
									<div class="col-sm-9">
										<div class="space"></div>
										
										<!-- 日历 -->
										<div id="calendar"></div>
									</div>

									<div class="col-sm-3">
										<div class="widget-box transparent">
											<div class="widget-header">
												<h4>点击拖动加入记事本</h4>
											</div>

											<div class="widget-body">
												<div class="widget-main no-padding">
													<div id="external-events">
														<div class="external-event label-grey" data-class="label-grey">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-success" data-class="label-success">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-danger" data-class="label-danger">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-purple" data-class="label-purple">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-yellow" data-class="label-yellow">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-pink" data-class="label-pink">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<div class="external-event label-info" data-class="label-info">
															<i class="ace-icon fa fa-arrows"></i>
															请输入内容
														</div>

														<label>
															<input type="checkbox" class="ace ace-checkbox" id="drop-remove" />
															<span class="lbl"> 拖动之后移除</span>
														</label>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
								<!-- PAGE CONTENT ENDS -->
								
							</div><!-- /.col -->
						</div><!-- /.row -->
					</div><!-- /.page-content -->
				</div>
			</div><!-- /.main-content -->

			<!-- 公共页面的尾部 -->
			<div th:replace="admin/common/footer :: footer"></div>

			<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
				<i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
			</a>
		</div><!-- /.main-container -->

		<!-- basic scripts -->

		<!--[if !IE]> -->
		<script th:src="@{/static/admin/js/jquery/jquery-2.1.4.min.js}"></script>

		<!-- <![endif]-->

		<!--[if IE]>
		<script th:src="@{/static/admin/js/jquery/jquery-1.11.3.min.js}"></script>
		<![endif]-->
		<script type="text/javascript">
			if('ontouchstart' in document.documentElement) document.write("<script th:src='@{/static/admin/js/jquery/jquery.mobile.custom.min.js}'>"+"<"+"/script>");
		</script>
		<script th:src="@{/static/admin/js/bootstrap/bootstrap.min.js}"></script>

		<!-- page specific plugin scripts -->
		<script th:src="@{/static/admin/js/jquery-ui/jquery-ui.custom.min.js}"></script>
		<script th:src="@{/static/admin/js/jquery-ui/jquery.ui.touch-punch.min.js}"></script>
		<script th:src="@{/static/admin/js/plugins/moment.min.js}"></script>
		<script th:src="@{/static/admin/js/fullcalendar/fullcalendar.min.js}"></script>
		<script th:src="@{/static/admin/js/fullcalendar/locale/zh-cn.js}"></script>
		<script th:src="@{/static/admin/js/plugins/bootbox.js}"></script>

		<!-- ace scripts -->
		<script th:src="@{/static/admin/js/ace/ace-elements.min.js}"></script>
		<script th:src="@{/static/admin/js/ace/ace.min.js}"></script>
		<script type="text/javascript" th:src="@{/static/admin/js/gweb/gweb.js}"></script>
		<script type="text/javascript" th:src="@{/static/admin/js/gweb/calendar.js}"></script>
		
	</body>
</html>
